<template>
  <div id="app">
    <router-view/>
    <tabbar>
      <tabbar-item path="/home" activeColor= "#0000FF">
        <img slot="item-img" src="./assets/imgs/tabbar/home.svg">
        <img slot="item-img-active" src="./assets/imgs/tabbar/home_active.svg">
        <div slot="item-title">首页</div>
      </tabbar-item>
       <tabbar-item path="/category" activeColor= "#0000FF">
        <img slot="item-img" src="./assets/imgs/tabbar/catergory.svg">
        <img slot="item-img-active" src="./assets/imgs/tabbar/catergory_active.svg">
        <div slot="item-title">分类</div>
      </tabbar-item>
       <tabbar-item path="/cart" activeColor= "#0000FF">
        <img slot="item-img" src="./assets/imgs/tabbar/cart.svg">
        <img slot="item-img-active" src="./assets/imgs/tabbar/cart_active.svg">
        <div slot="item-title">购物车</div>
      </tabbar-item>
       <tabbar-item path="/profile" activeColor= "#0000FF">
        <img slot="item-img" src="./assets/imgs/tabbar/profile.svg">
        <img slot="item-img-active" src="./assets/imgs/tabbar/profile_active.svg">
        <div slot="item-title">关于</div>
      </tabbar-item>      
    </tabbar>
  </div>
</template>

<script>
import Tabbar from './components/Tabbar/Tabbar.vue';
import TabbarItem from './components/Tabbar/TabarItem.vue';

export default {
  name: 'App',
  components: {
   Tabbar,
   TabbarItem
  }
}
</script>

<style scoped>
</style>>
